import { Image } from 'antd';
import * as moment from 'moment';
import styles from '../style.less';
import { LastPatrolItem } from '../types.d';

const PatrolImage = (props: { item: LastPatrolItem }) => {
  const { item } = props;
  return (
    <div className={styles.patrolImg}>
      <Image src={item.composeImageUrl} height={180} />
      <ul className={styles.infoList}>
        <li>
          <span className={styles.title}>巡检设备：</span>
          <span>{item.deviceSn}</span>
        </li>
        <li>
          <span className={styles.title}>巡检泊位：</span>
          <span>{item.parkingSpotId}</span>
        </li>
        <li>
          <span className={styles.title}>巡检车牌：</span>
          <span>{item.plateNumber || '暂无车牌'}</span>
        </li>
        <li>
          <span className={styles.title}>巡检时间：</span>
          <span>{moment(item.plateNumberRecognitionTime).format('YYYY-MM-DD HH:mm:ss')}</span>
        </li>
      </ul>
    </div>
  );
};

export default PatrolImage;
